{extend name="public:layout" /}
{block name="title"}优惠券销售统计{/block}
{block name="head"}
{/block}
{block name="body"}
<div class="wrapper wrapper-content">
    <div class="ibox">
        <div class="ibox-title">
            <ol class="breadcrumb">
                <li><i class="fa fa-hand-o-right"></i> 优惠券销售统计</li>
            </ol>
        </div>
        <div class="ibox-content">
            <div class="toolbar">
                <div class="pull-left">
                </div>
                <div class="pull-right">
                </div>
                <div class="clearfix"></div>
            </div>
            <div id="chart" style="width: 100%;height: 400px"></div>
            <table class="table" id="grid">
                <tr>
                    <th width="40">#</th>
                    <th>订单号</th>
                    <th>购买人</th>
                    <th>购买时间</th>
                    <th>支付截止时间</th>
                    <th>价格</th>
                    <th>是否已支付</th>
                </tr>
                {volist name="list" id="vo"}
                <tr>
                    <td>{$vo.id}</td>
                    <td>{$vo.order_sn}</td>
                    <td>{$vo.member_name}</td>
                    <td>{$vo.create_time|date="Y-m-d H:i:s",###}</td>
                    <td>{$vo.end_time|date="Y-m-d H:i:s",###}</td>
                    <td>{$vo.order_price}元</td>
                    <td>{eq name="vo.status" value="0" }
                        未支付
                    {else/}
                        已支付
                    {/eq}</td>
                </tr>
                {/volist}
            </table>
            <div class="page-bar">{$list->render()}</div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script src="/public/plugins/echarts/echarts-all.js"></script>
<script type="text/javascript">
    $(function(){
        $('[data-toggle="tooltip"]').tooltip()
    });
    var myChart = echarts.init(document.getElementById('chart'));
    option = {
        title : {
            text: '优惠券销售统计'
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data:{$data.name}
        },
        toolbox: {
            show : true,
            feature : {
                dataView : {show: true, readOnly: false},
                magicType : {show: true, type: ['line', 'bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'category',
                data : {$data.month}
            }
        ],
        yAxis : [
            {
                type : 'value'
            }
        ],
        series : [
            {volist name='data.data' id='vo'}
                {
                    name:'{$vo.name}',
                    type:'line',
                    data:{$vo.data},
                    markPoint : {
                        data : [
                            {type : 'max', name: '最大值'},
                            {type : 'min', name: '最小值'}
                        ]
                    }
                },
            {/volist}
        ]
    };
    myChart.setOption(option);
</script>
{/block}